<template>
  <div>
    <el-menu
      :collapse="isCollapse"
      :unique-opened="uniqueOpened"
      :default-active="defaultActive"
      :default-openeds="defaultOpeneds"
      class="el-menu-vertical"
      :collapse-transition="false"
      background-color="#001529"
      text-color="#bfcbd9"
      active-text-color="#409EFF"
    >
      <n-SubMenu
        :menus="menus"
        @executeRouter="executeRouter"
      ></n-SubMenu>
    </el-menu>
  </div>
</template>
<script>
import nSubMenu from './subMenu';
import { mapGetters } from 'vuex';
export default {
  components: {
    'n-SubMenu': nSubMenu
  },
  name: 'nMenu',
  props: {
    uniqueOpened: {
      type: Boolean,
      default: false
    },
    // isCollapse: {
    //     type: Boolean,
    //     default: false
    // },
    defaultActive: {
      type: String,
      default: ''
    },
    defaultOpeneds: {
      type: Array,
      default: function () {
        return [];
      }
    },
    menus: {
      type: Array,
      default: function () {
        return [];
      }
    }
  },
  data() {
    return {};
  },
  computed: {
    ...mapGetters({
      isCollapse: 'getSideBarStatus' // 侧边栏是否默认收起
    })
  },
  methods: {
    executeRouter(menu) {
      this.$emit('executeRouter', menu);
    }
  }
};
</script>
